<?php 
$channel=$this->channel;
?>

<div class="box_top top_new" style="clear:both;">
    <h2 class="label_top">Top Video Xem Nhiều Nhất</h2>
    <ul class="list_video" id="list_videos">
        <?php
            $modelR = new RemoveCircumflex();
            foreach($this->videos as $item):
         ?>
         <li><a href="/app/<?php echo $modelR->rewrite($item['name']);?>/detail/<?php echo $item['film_id']?>-<?php echo $modelR->rewrite($item['title_vi']);?>.html?channel=<?php echo $channel?>">
            <img src="<?php echo $item['thumb']?>"/>
            <span>
                <h3 class="title_video"><?php echo $item['title_vi']?></h3>
                <p><?php echo $item['national']?> | Lượt xem: <?php echo $item['hits']?></p>
            </span>
            <div class="clear"></div>
         </a></li>
         <?php
            endforeach;
          ?>
    </ul>
 </div>
<input type="hidden" name="page" id="page" value="<?php echo $this->page;?>" />
<input type="hidden" name="channel" id="channel" value="<?php echo $this->channel;?>" />
<input type="hidden" name="week_number" id="week_number" value="<?php echo $this->week_number;?>" /> 
<div style="text-align: center;" id="loadgif_event">
    <img id="animation_image" src="/images/loading.gif" style="display: none;" />
</div>
<script type="text/javascript">
    var loading = false;
    $( document ).ready(function() {         
        $(window).scroll(function() { //detect page scroll                      
        if($(window).scrollTop() >= $(document).height() - $(window).height())  //user scrolled to bottom of the page?
        {
            if(loading==false) //there's more data to load
            {
                loading = true; //prevent further ajax loading
                $('#animation_image').show(); //show loading image
                var page = $("#page").val();
                var week_number = $("#week_number").val();
                var channel = $("#channel").val();
                //load data from the server using a HTTP POST request
                $.post("/app/load-more-top.html",{'page': page, 'week_number': week_number, 'channel': channel}, function(data){
                    $('#animation_image').hide();
                    if (data!='') {
                        $("#list_videos").append(data); //append received data into the element
                        page++;
                        $("#page").val(page);
                        loading = false;    // release
                    };
                })
            }
        }        
    });
});

</script>